import React from "react";
import { NavLink } from "react-router-dom";
import Tab1 from "./tab/tab1";
import { HashRouter as Router, Route, Switch } from "react-router-dom";
var barcode = null;

export default class Counter extends React.Component {
  camcer = () => {
    var cmr = plus.camera.getCamera();
    var res = cmr.supportedImageResolutions[0];
    var fmt = cmr.supportedImageFormats[0];
    console.log("Resolution: " + res + ", Format: " + fmt);
    cmr.captureImage(
      function(path) {
        alert("Capture image success: " + path);
      },
      function(error) {
        alert("Capture image failed: " + error.message);
      },
      { resolution: res, format: fmt }
    );
  };
  onmarked = function() {
    var text = "未知: ";
    switch (type) {
      case plus.barcode.QR: 
        text = "QR: ";
        break;
      case plus.barcode.EAN13: 
        text = "EAN13: ";
        break;
      case plus.barcode.EAN8: 
        text = "EAN8: ";
        break;
    }
    alert(text + result);
  };
  createBarcode = () => {
    if (!barcode) {
      barcode = plus.barcode.create("barcode", [plus.barcode.QR], {
        top     : "100px",
        left    : "0px",
        width   : "100%",
        height  : "200px",
        position: "static"
      });
      barcode.onmarked = this.onmarked;
      plus.webview.currentWebview().append(barcode);
    }
    barcode.start();
  };

  render() {
    const { increase, decrease, boo } = this.props;
    if (boo) {
      return (
        <div>
          count: {this.props.count}
          <br />
          count1: {this.props.count1}
          <br />
          <button onClick={increase}>count++</button>
          <button onClick={decrease}>count1--</button>
          <button onClick={this.camcer}>摄像头</button>
          <button onClick={this.createBarcode}>二维码</button>
          <ul>
            <li>
              <NavLink to={this.props.match.url + "/leval1"}>leval1</NavLink>
            </li>
            <li>
              <NavLink to={this.props.match.url + "/leval2"}>leval2</NavLink>
            </li>
            <li>
              <NavLink to={this.props.match.url + "/leval3"}>leval3</NavLink>
            </li>
          </ul>
          <Route path={`${this.props.match.url}/:leval`} component={Tab1} />
        </div>
      );
    } else {
      return (
        <div>
          <NavLink to="/login">请先登录！</NavLink>
        </div>
      );
    }
  }
}
